<script setup>
import { ref, onMounted } from 'vue'
import ListView from '@/views/checkItem/list.vue'
import ModifyView from '@/views/checkItem/modify.vue'

const mref = ref(null)
const lref = ref(null)

const queryCheckItemList = () => {
  if (lref.value) { 
    lref.value.queryList()
  }
}

const updateCheckItem = async (data) => {
  if (mref.value) {
    mref.value.formData = { ...data }
    await mref.value.loadCheckTypeList() 
    mref.value.dialogVisible = true
  }
}

const addCheckItem = () => {
  if (mref.value) { 
    mref.value.formData = { 
      id: null, 
      name: null, 
      checkTypeId: null,
      method: null,
      standardValue: null,
      unit: null,
      max: null,
      min: null,
      description: null
    }
    mref.value.dialogVisible = true
  }
}

onMounted(() => {
  setTimeout(queryCheckItemList, 100) 
})
</script>

<template>
  <div class="check-item-container">
    <h2>检验项目管理</h2>
    <ListView 
      ref="lref" 
      @update="updateCheckItem" 
      @add="addCheckItem" 
    />
    <ModifyView 
      @query="queryCheckItemList" 
      ref="mref" 
    />
  </div>
</template>

<style scoped>
.check-item-container {
  padding: 20px;
  min-height: 300px; 
}
h2 {
  margin-bottom: 20px;
  color: #333;
}
</style>